﻿@{
    ViewData["Title"] = "角色权限设置";
    Layout = "~/Areas/Manager/Views/Shared/_Layout.cshtml";
}
@section scriptstop
    {
    <link href="~/manager/css/ztree/metroStyle.css" rel="stylesheet" />
    <script src="~/manager/js/jquery.min.js"></script>
    <script src="~/manager/js/ztree/jquery.ztree.all.js"></script>
    <script src="~/manager/js/json2.js"></script>
}
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-card">
            <div class="layui-card-header">角色分配权限</div>
            <div class="layui-card-body">
                <div class="layui-row">
                    <div class="layui-btn-container">
                        <div class="layui-btn-group">
                            <button class="layui-btn layui-btn-sm" id="btnSave"><i class="layui-icon">&#xe654;</i>保存</button>
                            <button class="layui-btn layui-btn-sm layui-btn-danger" id="btnClear"><i class="layui-icon">&#xe640;</i>清空</button>
                        </div>
                    </div>
                </div>
                <div class="layui-row" style="padding: 10px; background-color: #F2F2F2;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4">
                            <div class="layui-card">
                                <div class="layui-card-header">角色列表</div>
                                <div class="layui-card-body">
                                    <ul id="roleTree" class="ztree"></ul>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-md8">
                            <div class="layui-card">
                                <div class="layui-card-header">权限菜单</div>
                                <div class="layui-card-body">
                                    <ul id="menuTree" class="ztree"></ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@section scriptsfeet
    {

    <script type="text/javascript">
        var layer;
        layui.use(['layer'], function () {
            layer = layui.layer;
        });

        $(document).ready(function () {
            $.fn.zTree.init($("#roleTree"), roleSetting);
            $.fn.zTree.init($("#menuTree"), menuSetting);
            $("#btnSave").click(saveData);
            $("#btnClear").click(clearData);
        });

        var roleSetting = {
            async: {
                enable: true,
                url: " @Url.Action("roletree", "roles", new { area =Constant.AREAMANAGER })",
                autoParam: ["id", "name=n", "level=lv"],
                otherParam: { "__RequestVerificationToken": $("input[name='__RequestVerificationToken']").val() }
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            check: {
                enable: true,
                chkStyle: "radio",
                radioType: "level"
            }
            , callback: {
                onCheck: onCheck
            }
        };

        var menuSetting = {
            async: {
                enable: true,
                url: " @Url.Action("permissionstree", "roles", new { area =Constant.AREAMANAGER })",
                autoParam: ["id", "name=n", "level=lv"],
                otherParam: { "__RequestVerificationToken": $("input[name='__RequestVerificationToken']").val() }
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            check: {
                enable: true,
                chkboxType: { "Y": "s", "N": "s" }
            }
        };

        //选中角色触发的
        function onCheck(e, treeId, treeNode) {
            var zTree = $.fn.zTree.getZTreeObj("menuTree");
            zTree.checkAllNodes(false);
            if (treeNode.checked) {
                $.ajax({
                    url: " @Url.Action("rolepermissions", "roles", new { area = Constant.AREAMANAGER })?roleId=" + treeNode.id,
                    type: "GET",
                    success: function (res) {
                        for (var i = 0; i < res.length; i++) {
                            var obj = res[i];
                            obj.permissionId;
                            var node = zTree.getNodeByParam("id", obj.permissionId);
                            zTree.checkNode(node, true, false, false);
                        }
                    }
                });
            }
        }

        //保存选中的权限
        function saveData() {
            var roleTree = $.fn.zTree.getZTreeObj("roleTree");
            var roles = roleTree.getCheckedNodes(true);
            if (roles !== null && roles.length > 0) {
                var menuTree = $.fn.zTree.getZTreeObj("menuTree");
                var menus = menuTree.getCheckedNodes(true);
                if (menus === null || menus.length === 0) {
                    layer.alert("请选择要授权的菜单");
                } else {
                    var datas = [];
                    var roleId = roles[0].id;
                    for (var i = 0, menu; menu = menus[i]; i++) {
                        datas.push({ RoleId: roleId, PermissionId: menu.id });
                    }

                    $.ajax({
                        url: "@Url.Action("addpermissions", "roles", new { area = Constant.AREAMANAGER })",
                        type: "POST",
                        data: { datas: datas, __RequestVerificationToken: $("input[name='__RequestVerificationToken']").val() },
                        success: function (res) {
                            if (res.status === "success") {
                                layer.msg(res.msg);
                            } else {
                                layer.msg(res.msg);
                            }
                        }
                    });
                }
            } else {
                layer.alert("请选择一个角色");
            }
        }

        //清空该角色下的所有权限
        function clearData() {
            var roleTree = $.fn.zTree.getZTreeObj("roleTree");
            var roles = roleTree.getCheckedNodes(true);
            if (roles !== null && roles.length > 0) {
                var role = roles[0];
                layer.confirm("您确定要清空【" + role.name + "】下的所有权限?", {
                    btn: ['确认', '取消'] //按钮
                }, function () {
                    var menuTree = $.fn.zTree.getZTreeObj("menuTree");
                    $.ajax({
                        url: "@Url.Action("deletepermissions", "roles", new { area = Constant.AREAMANAGER })",
                        type: "POST",
                        data: { roleId: role.id },
                        success: function (res) {
                            menuTree.checkAllNodes(false);
                            if (res.status === "success") {
                                layer.msg(res.message);
                            } else {
                                layer.msg(res.message);
                            }
                        }
                    });
                });
            } else {
                layer.alert("请选择一个角色");
            }
        }
    </script>
}


